

@import '/src/global.less';

.main {
  width: 100%;
  height: 100%;
  padding: 24px;
  overflow: auto;
  .title{
    font-size: 28px;
  }

  .top{
    display: flex;
    margin-bottom: 16px;
    .itemBox{
      flex: 1;
      padding: 5px;
      height: 120px;
      .item{
        width: 100%;
         background: @select-color;
         border-radius: 8px;
         height: 100%;
         text-align: center;
         padding-top: 15px;
         .name{
          font-size: 20px;
         }
         .num{
          font-size: 36px;
         }
      }
      .runBg{
        background-color: @run-color;
      }
      .alarmBg{
        background-color: @alarm-color;
      }
      .faultBg{
        background-color: @fault-color;
      }
      .noOnBg{
        background-color: @no-on-color;
      }
    }

  }
  .flex{
    display: flex;
  }
  .modalItem{
    padding: 10px 20px;
    background-color: @plate-bg;
    border: 1px solid @border-line-color;
    margin-bottom: 16px;
   
    flex:1;
  }
  .flex .modalItem:not(:first-child){
   
    margin-left: 15px;
    flex:2;
  }
  .sinTitle{
    align-items: center;
    padding: 10px 0;
    .signLine {
      display: inline-block;
      width: 3px;
      height: 12px;
      background-color: #43b3bb;
      margin-right: 6px;
      vertical-align: -1px;
      
    }
  }
  
}

